<template>
  <div>
    <!-- <div class="parent" @click.self="handleParent">
      <div class="child" @click="handleChild"></div>
    </div> -->
    <a href="http://www.woniuxy.com" @click.prevent="go">蜗牛学苑</a>
  </div>
</template>

<script>
export default {
  methods: {
    handleParent() {
      console.log("handleParent.....");
    },
    handleChild() {
      console.log("handleChild.....");
    },
    go(){
      //e.preventDefault()
      alert('您确定要去蜗牛学苑')
      window.location.href="http://www.baidu.com"
      console.log('*******************');
    }
  },
};
</script>

<style lang="scss">
.parent {
  position: absolute;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background-color: orange;
  .child {
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: springgreen;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>